Hello, 各位 iT 邦幫忙 的粉絲們大家好~~~

在本系列文會利用目前 Visual Studio 內建的專案樣本建立一個初始的 .NET MAUI 專案，並且透過此 .NET MAUI 專案來把 TopStore App 的開發從 Xamairn.Forms 轉換到 .NET MAUI 上進行。

本篇是 Re: 從零改成用 .NET MAUI 技術來繼續過去用 Xamarin 開發的一個 App : TopStore 系列 系列文的 EP05。

緊接著就來修正有關 App.xaml 與 App.xaml.cs 的部份了。

在 https://ithelp.ithome.com.tw/users/20126714/ironman/4369 的 "EP 12: Implement and Use a Custom ValueConveter" 中，有設計了一個 ValueConverter 並在 App.xaml 當中撰寫成 "Application.Resources" 讓 "PersonDetailPage.xaml" 可以再根據編輯狀態切換 ToolbarItem 的文字顯示。

因此，在 .NET MAUI 版本的 TopStoreApp 要沿用這功能的話也勢必要在 App.xaml 來自定義 "Application.Resources"。

找到 .NET MAUI 版本的 App.xaml 檔案並開啟。

同樣的找到 Xamarin.Forms 版本的 TopStoreApp 專案，找到位在 Xamarin.Forms 專案當中的 App.xaml，並複製下圖綠色框的 XAML 標記碼：

在 .NET MAUI 版本的 App.xaml 的標記碼當中貼上如下圖紅色框所示的地方：

接著，先前在 Xamairn.Forms 版本的 TopStoreApp 有一些在 App.xaml.cs 所撰寫的程式，主要是為了能夠讓 MockData 跟 SQLiteDb 的資料互相切換，撰寫為 DI 使用的程式 "EP 26: MockData come back by (a little bit) DI design" ，若要搭配 UI 切換請參考 "EP 27: MockData come back with UI design in TopStore App"。

找到 .NET MAUI 版本的 App.xaml.cs 檔案並開啟。

同樣的找到 Xamarin.Forms 版本的 TopStoreApp 專案，找到位在 Xamarin.Forms 專案當中的 App.xaml.cs，並複製下圖綠色框圈選的 C# 程式碼：

在 .NET MAUI 版本的 App.xaml.cs 當中把下方綠色框所示的部分圈選起來：

並用剛剛複製的程式碼貼上，變成下圖紅色框所示：

此處會出現程式碼的編譯錯誤，在本 EP 先忽略它，在下一回當中會處理掉的。

再來因為 Shell 本身設定的 FontImageSource 要呈現的顏色，先前在 Xamarin.Forms 版本沒有設定會採用各平台的預設值作呈現。

而 .NET MAUI 的這個專案範本有進行樣式的設計，所以在這邊也順便改變 AppShell 所設定的 FontImageSource 要呈現的顏色成為使用專案範本的設計。

找到 .NET MAUI 的這個專案當中的 Resources 資料夾，並找到 Styles 資料夾下的 Styles.xaml 檔案並開啟：

接著下拉至檔案的最後準備新增 XAML 標記碼：

加入以下的 XAML 標記碼，設定 FontImageSource 的 Color 屬性套用其專案範本設定的樣式設定值：

    <Style TargetType="FontImageSource">
        <Setter Property="Color" Value="{AppThemeBinding Light={StaticResource White}, Dark={StaticResource Primary}}" />
    </Style>

加入的結果如下圖紅框所示：

上述的樣式設定值是會根據執行裝置的佈景主題設定為淺色/深色，進行對應的調整。

本 EP 介紹所完成的範例程式碼可在此下載。